// 网站统计

import { View } from "@tarojs/components";
import React, { Component } from "react";
import Echarts from ".";

export default class WebsiteStatistics extends Component{



    setChartOption(chart) {
          let option = {
    tooltip: {
      trigger: 'axis',
      position(pos, params, dom, rect, size) {
        if (pos[0] < size.viewSize[0] / 2) {
          return [pos[0], size.viewSize[1] / 3]
        } else {
         return [pos[0] - 100, size.viewSize[1] / 3]
        }
      }
    },
    grid: {
      left: '3%',
      right: '4%',
      bottom: '3%',
      containLabel: true
    },
    dataZoom: [
      {
       type: 'slider',
        start: 0,
        show: false,
        end: 60,
      },
      {
        type: 'inside',
        start: 0,
        end: 60,
        filterMode: 'filter',
      },

    ],

    xAxis: {

      type: 'category',

      boundaryGap: false,

      data: data.xData,

      axisLine: {

        lineStyle: {

          color: '#666666'

        }

      },

      axisTick: {

        show: false

      }

    },

    yAxis: {

      type: 'value',

      axisLine: {

        show: false,

        lineStyle: {

          color: '#666666'
        }
      },
      axisTick: {
        show: false
      },
      splitLine: {
        lineStyle: {
          color: ['#E6E6E6'],
          type: 'dashed'
        }
      }
    },
    series: data.itemData.map((item, index) => {
      return {
        name: item.name,
        type: 'line',
        data: item.data,
        lineStyle: {
          color: getColorByIndex(index)
        }
      }
    })
  };
    }

    render() {

        return (
            <View>
                <Echarts setChartOption={this.setChartOption.bind(this)}/>
            </View>
        )
    }
}